import Vue from 'vue'
import Vuex from 'vuex'
// import createPersistedState from "vuex-persistedstate";


Vue.use(Vuex)

export default new Vuex.Store({
  // plugins: [createPersistedState()],
  state: {
    active:"all",
    todosList:JSON.parse(localStorage.getItem('vuex')||'[]')
  },

  mutations: {
    saveNewTodo(state,newTodoVal){
      state.todosList.push({
        id:  Date.now(),
        text:newTodoVal,
        status:false

      })
      
    },
    updataTodosList(state,newtodos){
      state.todosList=newtodos
    },
    newActive(state,active){
      state.active=active
    },
    handleDeleteTodo(state,index){
      state.todosList.splice(index,1)
    },
  },
  actions: {
  },
  modules: {

  },
  getters:{
    filterTodos(state){
      if(state.active === "all"){
        return state.todosList
      }else if(state.active === "active"){
        return state.todosList.filter(val=>{
          if(!val.status ){
            return true
          }
          })
      }else{
          return state.todosList.filter(val=>{
            if(val.status){
              return true
            }
          })
          }
    
    }
  }
})
